<template>
  <navbar title="成绩" :isBack="true"></navbar>
  <search @change="change"></search>
  <view class="wrap" :style="{ minHeight: tools.clientTopHight(50) }">
    <loading v-if="!info.list.length"></loading>
    <picture
      v-if="!info.list.length && info.isFirst"
      title="暂无成绩"
      imgPath="/static/image/18.png"
      imgHeight="200rpx"
      imgWidth="360rpx"
      :height="tools.clientTopHight(50)"
    ></picture>
    <list v-else :list="info.list"></list>
  </view>
</template>

<script setup lang="ts">
import { reactive } from 'vue'
import { onLoad, onReachBottom } from '@dcloudio/uni-app'
import { getMatchAchievement } from '@/service/api/index'
import tools from '@/utils/tools'
import list from '@/common/list/score.vue'
import search from '@/common/menu/score.vue'

let info = reactive({
  isFirst: true,
  params: {
    page: 1,
    year: '',
    key: ''
  },
  list: []
})

// 赛事成绩查询列表
const getMatchAchievementApi = async () => {
  const { msg } = await getMatchAchievement(info.params)
  info.isFirst = false
  if (!msg.data.length && info.params.page != 1) {
    return tools.showToast('暂无更多数据'), info.params.page--
  }
  info.list = [...info.list, ...msg.data]
  // console.log(info.list)
}

// 菜单回调
const change = (e) => {
  if (!tools.looseEqual(info.params, e)) {
    info.params = JSON.parse(JSON.stringify(e))
    // 赛事成绩查询列表
    getMatchAchievementApi()
  }
}

onLoad(() => {
  // 赛事成绩查询列表
  getMatchAchievementApi()
})

onReachBottom(() => {
  info.params.page++
  // 赛事成绩查询列表
  getMatchAchievementApi()
})
</script>

<style>
page {
  background-color: #f9f9f9;
}
</style>
<style lang="scss" scoped>
.wrap {
  margin-top: 100rpx;
}
</style>
